<template>
    <div class="check-box">
        <div v-if="!updateFlag" class="title">当前版本已经是最新版本,无需更新</div>
        <div v-else>
            <div class="title">有新版本可以使用</div>
            <div class="title">当前版本:{{ oldVersion }}</div>
            <div class="title">最新版本:{{ newVersion }}</div>
            <div><el-button @click="download()" size="small">点击更新</el-button></div>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            updateFlag: false,
            newVersion: '',
            oldVersion: '',
            url: ''
        }
    },
    mounted() {
        this.checkVersion()
    },
    methods: {
        async checkVersion() {
            this.oldVersion = require('../../package.json').version
            let params = {
                platform: this.$route.query.platform,
                arch: this.$route.query.arch,
                version: this.oldVersion
            }
            let res = await this.$axios.post('versionRecord/check', params)
            if (res.data.code == 200) {
                if (res.data.data) {
                    this.updateFlag = true
                    this.url = res.data.data.url
                    this.newVersion = res.data.data.version
                }
            }
        },
        download() {
            window.ipcRenderer.sendSync('download', this.url)
        }
    }
}
</script>

<style scoped>
.check-box {
    height: 300px;
    width: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 0 auto;
    padding-top: 30px;
}
.logo {
    height: 48px;
    width: 48px;
}
.title {
    font-size: 16px;
    font-weight: bold;
    line-height: 50px;
}
</style>
